<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" charset="UTF-8">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="format-detection" content="telephone=no">
		
		<link type="text/css" rel="stylesheet" href="../css/model/bootstrap.css" />
		<link type="text/css" rel="stylesheet" href="../css/top_main.css" />
		<link type="text/css" rel="stylesheet" href="../css/footer.css" />
		<link type="text/css" rel="stylesheet" href="../css/suggest.css" />
		
		<script type="text/javascript" src="../js/model/jquery-2.1.4.min.js"></script>
		<script type="text/javascript" src="../js/model/bootstrap.js"></script>
		<script type="text/javascript" src="../js/layer/layer.js"></script>
		<script type="text/javascript" src="../js/model/reset_font.js"  ></script>
		
		<style>
			.layui-layer-dialog .layui-layer-content{
				width:auto;min-width:2.68rem;
				height: 0.74rem;line-height: 0.74rem;
				padding:0 0.4rem;
				
				text-align: center;
				border-radius:10px;
				overflow: hidden;
			}
		</style>
		
		<title>优当借书</title>
		<script>
				$(function(){
					$("body").css("opacity",1);
				})
				
			</script>
		</head>
		<body style="opacity: 0;">
			<div class="top">
				<a href="me.html" class="goback">
					<img src="../images/icons/goback1.png" />
				</a>
				<span>反馈意见</span>
			</div>
		    <form name="myform" class="myform" action="me.html" method="post">
		    	<input type="hidden" value="" class="mysuggest"  />
			<div class="main">
				<div class="title">轻轻的吐槽，我们会帮你保密哦</div>
				<div class="item">
					<div class="sub_title">APP问题</div>
					<ul class="options">
						<li class="active" id="11">登录异常</li>
						<li id="12">找不到想要的</li>
						<div class="clear"></div>
					</ul>
					
					<div class="sub_title">图书质量问题</div>
					<ul class="options">
						<li id="21">盗版图书</li>
						<li id="22">图书种类少</li>
						<div class="clear"></div>
					</ul>
					
					<div class="sub_title">其他</div>
					<ul class="options">
						<li id="31">改进建议</li>
						<li id="32">其他吐槽</li>
						<div class="clear"></div>
					</ul>
				</div>
				
				<div class="title">请详细描述您的建议或者遇到的问题</div>
				<div class="item">
					<textarea placeholder="请输入你的问题" onkeyup="limited()" maxlength="60"></textarea>
					<div class="mywords">
						<span class="mynum">0</span>/<span class="maxnum" >60</span>
					</div>
				</div>
				
				<input type="button" class="tjfk" value="提交反馈" name="tjfk"  />
				
			</div>
			
			</form>
			<div class="tips" style="display: none;">
				<!--<div class="tip_suc">-->
					<div class="suc">
						提交成功
					<!--</div>-->
					
				</div>
			</div>
			<script >
				$(function(){
					
					$(".options li").click(function(){
						var flag=$(this).hasClass("active");
						if(!flag){
							$(this).addClass("active");
						}else{
							$(this).removeClass("active");
						}
					})
					
				$(".tjfk").click(function(){
					checkform();
				})
					
				})
				function limited(){
					var textarea_len=$("textarea").val().length*1;
					var maxnum=$(".maxmum").text()*1;
					if(textarea_len<60){
						$(".mynum").text(textarea_len);
					}else{
						$(".mynum").text(60);
						
						layer.msg("输入字数超出最大限制");
					}
				}
				
				function checkform(){
					var li_len=$(".options li").length;
					var num=0;
					var arr="";
					console.log(li_len);
					
					for(var i=0;i<li_len;i++){
						if($(".options li").eq(i).hasClass("active")){
							num=num+1;
							arr+="id="+$(".options li").eq(i).attr("id");
						}
					}
					if(num>0){
						$(".mysuggest").val(arr);console.log($(".mysuggest").val());
						layer.msg("提交成功");
						
						setTimeout(function(){
							$(".myform").submit();						
						},1000)
						
					}else{
						layer.msg("您还没有选择意见");
						return false;
					}
					
				}
				
				function submitform(rv){
					
					if(rv){
						return true;
					}else{
						return false;
					}
					
				}
//				function sub(){
//					$(".tips").fadeIn(400);
//				}
//				function sub_out(){
//					$(".tips").fadeOut(500);
//					
//				}

			</script>
		</body>	
</html>
